html,body {
	width: 100%;
	height: 100%;
	overflow: auto;
}

.body_warp {
	background: url(images/bg.gif);
}

.design-wrap {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.shortcut_switch {
	display: none;
	height: 16px;
	position: fixed;
	z-index: 301;
	bottom: 0px;
	width: 333px;
	background: url(images/switch.png) no-repeat -1px 2px;
	cursor: pointer;
}
.design-control {
	text-align: left;
	position: fixed;
	z-index: 301;
	height: 73px;
	border:2px solid #3fa2de;
}
.control-item{
	width:75px;
	display:inline-block;
	*display:inline;
	*zoom:1;
	height:100%;
	text-align:center;
	vertical-align: middle;
	position:relative;
}
#add_prcs_copy{
	background: url(images/prcs.png) no-repeat center center;
	width:42px;
	height:42px;
	left:16px;
	top:0px;
	position:absolute;
}
#add_prcs{
	width:42px;
	height:42px;
	left:16px;
	top:0px;
	position:absolute;
}
.tbg{
	background: url(images/t_bg.png) no-repeat center center;	
}
.add_prcs_move{
	background: url(images/t_90_bg.png) no-repeat center center;	
}
.block-title{
	font-size:14px;
	font-weight:bold;
	width:100%;
	position:absolute;
	left:0px;
	top:50px;
	text-align:center;
	color:#666666;
}
.control-content{
	float:left;
	height:100%;
}
.control-edge{
	width:16px;
	text-align:center;
}
.content-open{
	background: url(images/left.png) no-repeat center center;
	background-color:#3fa2de;
}

.content-center{
	padding:0 10px;
	background: url(images/content-bg.png) repeat-x;
}
.content-close{
	background: url(images/right.png) no-repeat center center;
	background-color:#3fa2de;
}

.design-panel {
	height: 100%;
	overflow:hidden;
}

#old_style {
	top: 150px;
	margin: 5px;
}

.add_prcs {
	z-index: 311;
	font-size: 10px;
	background-color: white;
	opacity: 0.9;
	filter: alpha(opacity = 90);
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	color: black;
	padding: 0px;
	text-align: center;
	cursor: pointer;
	-webkit-transition: -webkit-box-shadow 0.15s ease-in;
	-moz-transition: -moz-box-shadow 0.15s ease-in;
	-o-transition: -o-box-shadow 0.15s ease-in;
	transition: box-shadow 0.15s ease-in;
}

.control-title .caret-top {
	display: inline-block;
	width: 0;
	height: 0;
	vertical-align: top;
	border-top: 8px solid #000000;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	content: "";
	cursor: pointer;
	margin: 4px;
}

.design-control .static-block {
	border: 1px solid red;
}
.design-panel .static-rectangle{
	border: 1px solid red;
}
.design-panel .static-diamond{
	background-image:url(images/diamond_red.png);
}
.design-panel .static-ellipsegreen{
	background-image:url(images/ellipsegreen_red.png);
}
.design-panel .static-ellipsepink{
	background-image:url(images/ellipsepink_red.png);
}
#arrow-block {
	background:url(images/arrow.png) no-repeat center center;
	width:42px;
	height:42px;
	left:16px;
	top:0px;
	position:absolute;
	z-index: 301;
}
._jsPlumb_endpoint { z-index:1;}

._jsPlumb_connector._jsPlumb_hover,  ._jsPlumb_connector._jsPlumb_dragging{
    z-index:4 !important;
}
._jsPlumb_endpoint._jsPlumb_hover {
    z-index:4 !important;
}
._jsPlumb_endpoint {
	cursor: pointer;
}

._jsPlumb_connector {
	z-index: 2;
}

.prcs-block {
	background-color: white;
	border: 1px solid #346789;
	width: 150px;
	height: 70px;
	text-align: center;
	z-index: 3;
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;	
	cursor: pointer;
	display:table; 
	position: absolute;
	_position:relative; 
	overflow:hidden; 
	color: black;
}
.shape-diamond{
	background-color:transparent;
    width:150px;
    height:100px;
    background-image:url(images/diamond.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
}
.shape-diamond-hover{
	background-color:transparent;
    width:150px;
    height:100px;
    background-image:url(images/diamond_orange.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
    color: orange;
}
.shape-ellipsegreen{
	background-color:transparent;
    width:150px;
    height:88px;
    background-image:url(images/ellipsegreen.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
}
.shape-ellipsegreen-hover{
	background-color:transparent;
    width:150px;
    height:88px;
    background-image:url(images/ellipsegreen_orange.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
    color: orange;
}
.shape-ellipsepink{
	background-color:transparent;
    width:150px;
    height:88px;
    background-image:url(images/ellipsepink.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
}
.shape-ellipsepink-hover{
	background-color:transparent;
    width:150px;
    height:88px;
    background-image:url(images/ellipsepink_orange.png);
    background-repeat:no-repeat;
	border:1px solid transparent;
    color: orange;
}

.shape-rectangle{
	box-shadow: 2px 2px 19px #e0e0e0;
	-o-box-shadow: 2px 2px 19px #e0e0e0;
	-webkit-box-shadow: 2px 2px 19px #e0e0e0;
	-moz-box-shadow: 2px 2px 19px #e0e0e0;
	-webkit-transition: -webkit-box-shadow 0.15s ease-in;
	-moz-transition: -moz-box-shadow 0.15s ease-in;
	-o-transition: -o-box-shadow 0.15s ease-in;
	transition: box-shadow 0.15s ease-in;	
}
.shape-rectangle-hover{
	border: 1px solid #123456;
	box-shadow: 2px 2px 19px #444;
	-o-box-shadow: 2px 2px 19px #444;
	-webkit-box-shadow: 2px 2px 19px #444;
	-moz-box-shadow: 2px 2px 19px #fff;
	opacity: 0.9;
	filter: alpha(opacity = 90);	
	border: 1px solid orange;
	color: orange;
}
.prcs-block .prcs-tontent-wrap{
	vertical-align:middle; 
	display:table-cell; 
	_position:absolute; 
	_top:50%; 
}
.prcs-block .content{
	width:100%;
	text-align:center;
	_position:relative; 
	_top:-50%; 
}
#context-menu {
	z-index: 100;
}

.design-menu {
	min-width: 100px;
}
#tooltip h3{
	line-height:20px;
}

.explanation { 
	position:fixed; 
	left:2px; top:2px;
	background-color:white;
	border:2px solid #ddd; 
	padding:10px 5px;
	opacity:0.9;
	z-index:5000;
	-moz-border-radius:5px;
	border-radius:5px;
	filter:alpha(opacity=80);
	box-shadow: 2px 2px 19px #aaa;
   -o-box-shadow: 2px 2px 19px #aaa;
   -webkit-box-shadow: 2px 2px 19px #aaa;
   -moz-box-shadow: 2px 2px 19px #aaa;
}

.explanation_handle ul {
    margin: 6px;
}

.explanation_handle li {
    margin-top: 6px;
}

.close {
    float: right;
    font-size: 13px;
    font-weight: bold;
    line-height: 20px;
    color: #000000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}
.close:hover,
.close:focus {
    color: #000000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.4;
    filter: alpha(opacity=40);
}
button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}